// wdl_weihouse/pages/share/paper.js
var app = getApp();
Page({

  /**
   * 页面的初始数据
   */
  data: {
    share_url: '',
    /*分享页面地址 */
    face: '/wdlebroker/static/images/get_avatar.png', //封面图
    touxiang: '/wdlebroker/static/images/get_avatar.png', //头像
    ercode: '/wdlebroker/static/images/get_avatar.png' //二维码
  },

  /**
   * 加载参数
   */
  load_info: function(cate, id) {
    const self = this;
    app.util.request({
      'url': 'entry/wxapp/share',
      data: {
        op: 'make',
        category: cate,
        infoid: id
      },
      success(res) {
       console.log(res);

        wx.showToast({
          title: '生成海报中...',
          icon: 'loading'
        });
        setTimeout(function() {
          self.downloadfile(res.data.data);

        }, 1000)

      }
    });
  },
  /**
   * 加载网络图片 在本地
   */
  downloadfile: function(info) {
    const self = this;
    try {
      wx.getImageInfo({
        src: info.thumb,
        success: function(e) {
          self.setData({
            face: e.path
          });
        },
        complete: function(e) {
          //获取头像
          wx.getImageInfo({
            src: info.avatar,
            success: function(e) {
              self.setData({
                touxiang: e.path
              });
            },
            complete: function(e) {
              //获取二维码
             // console.log(info)
              wx.getImageInfo({
                src: info.ercode,
                success: function(e) {
                  self.setData({
                    ercode: e.path
                  });
                },
                complete: function(e) {
                  //开始生成海报
                  self.drawPaperImage(self, info);
                }
              });
              //===
            }
          });
          //===
        }
      })
      //===
    } catch (e) {
      console.log('e');
    }

  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function(options) {
    const self = this;
    var category = 'paper';
    var id = 0;
    var uid = 0;
    if (!app.kbtools.isnull(options.cate)) {
      category = options.cate;
    }
    if (!app.kbtools.isnull(options.id)) {
      id = parseInt(options.id);
    }

    self.load_info(category, id);
    /*
    wx.getStorage({
      key: 'userInfo',
      success: function (res) {
        if(! app.kbtools.isnull(res.data.memberInfo)){
          uid = res.data.memberInfo.uid;
        }
        var host = app.kbtools.url_to_host(app.siteInfo.siteroot);
        self.setData({
          share_url: host + '/app/index.php?i=' + app.siteInfo.uniacid + '&c=entry&m=wdl_weihouse&do=share&category=' + category + '&infoid=' + id + '&uid='+uid
        }) 
      }
    }); */


  },
  /**
   * 生成海报的功能
   */
  drawPaperImage: function(self, info) {

    var context = wx.createCanvasContext('mycanvas');
    context.setFillStyle("#FFFFFF")
    context.fillRect(0, 0, 375, 697);
     console.log(self.data);
    //绘制背景图
    /*  wx.getImageInfo({
        src: info.thumb,
        success: function (e) {
          console.log(e);
          context.drawImage(e.path, 0, 0, 375, 283);*/

    context.drawImage(self.data.face, 0, 0, 375, 283);
    //绘制头像
    /*wx.getImageInfo({
      src: info.avatar,
      //success:function(e){
      complete: function(e){ 
        console.log(e);
        var path1 = e.path;    */
    // 头像图片
    var path1 = self.data.touxiang;
    var name = info.title;
    //绘制名字
    context.setFontSize(22);
    context.setFillStyle('black');
    context.setTextAlign('center');
    context.fillText(name, 185, 390);
    context.stroke();
    //绘制标题
    context.setFontSize(24);
    context.setFillStyle('red');
    context.setTextAlign('center');
    context.fillText(info.price, 185, 430);
    context.stroke();

    //绘制一起吃面标语
    context.setFontSize(20);
    context.setFillStyle('black');
    context.setTextAlign('center');
    context.fillText(info.housetype, 185, 480);
    context.stroke();

    //绘制电话号码
    context.setFontSize(20);
    context.setFillStyle('black');
    context.setTextAlign('center');
    context.fillText(info.mianji, 185, 520);
    context.stroke();
    //绘制验证码背景
    //context.drawImage(path3, 48, 390, 280, 84);

    //绘制左下角文字背景图
    //context.drawImage(path4, 25, 520, 184, 82);
    context.setFontSize(18);
    context.setFillStyle('black');
    context.setTextAlign('left');
    context.fillText("长按识别二维码", 185, 610);
    context.stroke();
    context.setFontSize(18);
    context.setFillStyle('black');
    context.setTextAlign('left');
    context.fillText("查看更多详细信息", 185, 640);
    context.stroke();

    //绘制右下角扫码提示语

    /**获取 二维码 */
    /* wx.getImageInfo({
       src: info.ercode,
       success: function (e) {
           console.log(e)
           //绘制小程序码
         if (!app.kbtools.isnull(e.path)){
           context.drawImage(e.path, 30, 530, 130, 130);
         }*/
    context.drawImage(self.data.ercode, 30, 530, 130, 130);

    //绘制头像
    context.arc(186, 306, 50, 0, 2 * Math.PI) //画出圆
    context.strokeStyle = "#ffe200";
    context.clip(); //裁剪上面的圆形
    context.drawImage(path1, 116, 246, 150, 150); // 在刚刚裁剪的园上画图
    //输出整个图片
    context.draw();
    //将生成好的图片保存到本地，需要延迟一会，绘制期间耗时
    setTimeout(function() {
      wx.canvasToTempFilePath({
        canvasId: 'mycanvas',
        success: function(res) {
          var tempFilePath = res.tempFilePath;
          self.setData({
            imagePath: tempFilePath,
            canvasHidden: true
          });
          //隐藏 loading
          wx.hideToast();
        },
        fail: function(res) {
          console.log(res);
        }
      });
    }, 200);
    /*          }
           })//============二维码

      
         }
       })
       //
         }
       });*/
  },

  //点击保存到相册
  baocun: function() {
    var that = this
    wx.saveImageToPhotosAlbum({
      filePath: that.data.imagePath,
      success(res) {
        wx.showModal({
          content: '图片已保存到相册，赶紧晒一下吧~',
          showCancel: false,
          confirmText: '好的',
          confirmColor: '#333',
          success: function(res) {
            if (res.confirm) {
              console.log('用户点击确定');
              /* 该隐藏的隐藏 */
              that.setData({
                maskHidden: false
              })
            }
          },
          fail: function(res) {
            console.log(11111)
          }
        })
      }
    })
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function() {

  }
})